<template>
  <div>
    <h2>Contact Details</h2>
    <p>Full Name: {{ contact.fullName }}</p>
    <p>First/Given: {{ contact.firstName }}</p>
    <p>Middle: {{ contact.middleName }}</p>
    <p>Last/Family/Surname: {{ contact.lastName }}</p>
    <p>Badge ID: {{ contact.badgeId }}</p>
    <p>Email: {{ contact.email }}</p>
    <p>ID: {{ contact.id }}</p>
    <p>username: {{ contact.username }}</p>
    <p>Phone: {{ contact.phone }}</p>
    <p>Veteran: {{ contact.veteran }}</p>
    <p>National Residency: {{ contact.residency }}</p>
    <p>Gender: {{ contact.gender }}</p>
  </div>
</template>

<script>
export default {
  name: "ContactDetails",
  props: ["contact"]
};
</script>
